import React from 'react';
import { LaptopOutlined, NotificationOutlined, UserOutlined } from '@ant-design/icons';
import type { MenuProps } from 'antd';
import { Layout, Menu, theme } from 'antd';
import { Outlet } from 'react-router-dom';
import Header from "../../../components/Header";
import Sider from "../../../components/Sider";
import Breadcrumb from "../../../components/Breadcrumb";
const { Content } = Layout;

function Index() {
    const {
        token: { colorBgContainer },
    } = theme.useToken();
    return (
        <Layout style={{height:"100vh"}}>
            <Header></Header>
            <Layout>
               <Sider></Sider>
                <Layout style={{ padding: '0 24px 24px' }}>
                    <Breadcrumb></Breadcrumb>
                    <Content
                        style={{
                            padding: 24,
                            margin: 0,
                            minHeight: 280,
                            background: colorBgContainer,
                        }}
                    >
                        <Outlet></Outlet>
                    </Content>
                </Layout>
            </Layout>
        </Layout>
    );
}

export default Index;
